/*global*/
html { overflow:hidden}
body { overflow:hidden; margin:0; padding:0; font-size:10px; font-family:Tahoma}

/*canvas shape*/
canvas { position:absolute; top:10px; left:0}

/*guide*/
.guide { position:absolute; left:70px; top:0; display:inline-block; text-align:center; border-left:1px dashed #333; height:80px}
.guide i { display:inline-block; position:absolute; top:30px; height:10px; line-height:10px; opacity:.6; background-color:#fff; border:1px solid #333; padding:2px 4px; font-size:14px; font-style:normal; color:#000; z-index:20; margin-left:-9px}
.ver .guide { display:block; height:0; left:0; top:70px; width:70px; padding-left:10px; border-left:0; border-top:1px dashed #333}
.ver .guide i { top:-5px; left:-5px; position:relative; margin:0 auto}

/*operate*/
.operate { position:absolute; height:40px; width:40px; top:20px; left:20px; z-index:10}
.operate i { display:block; float:left; width:16px; cursor:pointer; height:16px; margin:2px; background:url(operate_icon.png) no-repeat 0 0}
.operate .o-close { background-position:-19px 0}
.operate .o-direction { background-position:-57px 0}
.operate .o-set { background-position:-38px 0}

/*change color*/
.option { position:absolute; left:70px; top:25px; font-size:12px; padding:5px; background-color:#fff; opacity:.8; font-weight:700; z-index:50}
.option input, .option button { margin:0 5px}
